<template>
	<!-- 特色服务 -->
	<view class="home-special">
		<view class="body">
			<view class="specail-box">
				<view v-for="(item, index) in list" :key="index" :class="(index + 1) % 4 === 0 ? '' : 'mr19'" class="icons-item" @click="routePage(item)">
					<view class="icons-item-img"><image :src="item.icon"></image></view>
					<text class="icons-item-text">{{ item.name }}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			list: [
				// {
				// 	name: '特价活动',
				// 	key: 'ywdz',
				// 	icon: 'https://image1.suning.cn/uimg/cms/img/158089307224112712.png',
				// 	uri: '/pages/index/dailyList/dailyList',
				// 	direct: true,
				// 	titleBar: '每日特价'
				// },
				{
					name: '报单产品',
					key: 'ywdz',
					icon: 'https://imgservice1.suning.cn/uimg1/anubis/pindao/oYagKObNRbEpRcw9ujxozw.png',
					uri: '/pages/index/vipList/vipList',
					direct: true,
					titleBar: '报单产品'
				},

				{
					name: '我的收益',
					key: 'ycwz',
					icon: 'https://image1.suning.cn/uimg/cms/img/159471476746996280.png',
					uri: '/pages/mine/team/team',
					direct: true,
					titleBar: '我的收益'
				},
				// {
				// 	name: '拼团专区',
				// 	key: 'hyfw',
				// 	icon: 'https://imgservice3.suning.cn/uimg1/anubis/pindao/lYKbzMfgd970FKBtPbI6uA.png',
				// 	uri: '/pages/index/groupList/groupList',
				// 	direct: true,
				// 	titleBar: '拼团专区'
				// },
				// {
				// 	name: '高额返券',
				// 	key: 'hyfw',
				// 	icon: 'https://image3.suning.cn/uimg/cms/img/158225098618947382.png?from=mobile',
				// 	uri: '/pages/index/integralList/integralList',
				// 	direct: true,
				// 	titleBar: '高额返券'
				// },
				{
					name: '邀请好友',
					key: 'ycwz',
					icon: 'https://image1.suning.cn/uimg/cms/img/156283194935322426.png',
					uri: '/pages/mine/invite/invite',
					direct: true,
					titleBar: '邀请好友'
				},
				// {
				// 	name: '产品分类',
				// 	key: 'xsgh',
				// 	icon: 'https://image1.suning.cn/uimg/cms/img/156326902619181055.png',
				// 	uri: '/pages/shop/classify/classify',
				// 	direct: true,
				// 	titleBar: '产品分类'
				// },

				{
					name: '玩法简介',
					key: 'ycwz',
					icon: 'https://image1.suning.cn/uimg/cms/img/156333047957553424.png',
					uri: '/pages/web/imgTest?type=groupExplain&title=玩法简介',
					direct: true,
					titleBar: '邀请好友'
				}
			]
		};
	},

	methods: {
		routePage(item) {
			if (item.uri == '/pages/mission/index') {
				return uni.switchTab({
					url: item.uri
				});
			}
			uni.navigateTo(
				{
					url: item.uri
				},
				item.params
			);
		}
	}
};
</script>

<style lang="scss" scoped>
view {
	display: flex;
}
.mr19 {
	// margin-right: 19upx;
}
/* 特色服务 */
.home-special {
	background-color: #ffffff;
	width: 750upx;
	padding-left: 30upx;
	position: relative;
	z-index: 100;
	flex-direction: column;
	.body {
		width: 100%;

		align-items: center;
		.icons-item {
			position: relative;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			width: 158upx;
			height: 160upx;
			border-radius: 10upx;
			.icons-item-img {
				width: 80upx;
				height: 80upx;
				justify-content: center;
				align-items: center;
			}
			.icons-item-img image {
				width: 80upx;
				height: 80upx;
			}
			.icons-item-text {
				font-size: 22upx;
				margin-top: 10upx;
				color: rgb(50, 52, 55);
			}
		}
	}
	.specail-box {
		justify-content: space-around;
		width: 690upx;
		// padding: 0 40upx;
		// justify-content: space-between;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
	}
}
.icon {
	border-radius: 20upx;
	height: 20upx;
	width: 40upx;
	position: absolute;
	right: 0;
	top: 20upx;
	background-color: #ff0004;
	color: #ffffff;
	font-size: 18upx;
	text-align: center;
	line-height: 20upx;
}
</style>
